<template>
	<view class="cityContent">
		<view class="conlation">
			<view class="iconfont icon-jiahao conlation-left">
				自动定位：{{kcity}}
			</view>
			<navigator url="/pages/changeCity/changeCity" class="conlation-right">
				切换<text class="iconfont icon-ziyuanxhdpi"></text>
			</navigator>
		</view>
		<view class="video-list">
			<view class="item">
				<view class="video">
					<video objectFit="fill" style="width: 100%;height: 100%;" src="http://localhost:8000/001.mp4" controls></video>
				</view>
				<view class="img">
					<image class="img-box" src="../static/img/002.jpg" mode=""></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video objectFit="fill" style="width: 100%;height: 100%;" src="http://localhost:8000/001.mp4" controls></video>
				</view>
				<view class="img">
					<image class="img-box" src="../static/img/002.jpg" mode=""></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video objectFit="fill" style="width: 100%;height: 100%;" src="http://localhost:8000/001.mp4" controls></video>
				</view>
				<view class="img">
					<image class="img-box" src="../static/img/002.jpg" mode=""></image>
				</view>
			</view>
			<view class="item">
				<view class="video">
					<video objectFit="fill" style="width: 100%;height: 100%;" src="http://localhost:8000/001.mp4" controls></video>
				</view>
				<view class="img">
					<image class="img-box" src="../static/img/002.jpg" mode=""></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:['kcity'],
		name:"cityContent",
		data() {
			return {
				
			};
		}
	}
</script>

<style>
.cityContent{
	/* padding: 4px; */
	width: 100%;
	background-color: #000000;
	z-index: 18;
}
.conlation{
	width: 100%;
	height: 40px;
	padding-top: 70px;
	overflow: hidden;
	color: #AAAAAA;
}
.conlation-left{
	float: left;
	font-size: 13px;
	padding-left: 15px;
}
.conlation-right{
	float: right;
	font-size: 13px;
	padding-right: 15px;
}
.video-list{
	width: 100%;
	background-color: #000000;
	overflow: auto;
}
.item{
	width: 50%;
	float: left;
	position: relative;
}
.video{
	width: 92%;
	height: 300px;
	margin-left: 4%;
}
.img{
	position: absolute;
	bottom: 7px;
	right: 15px;
}
.img-box{
	width: 30px;
	height: 30px;
	border-radius: 50%;
}
</style>
